<template>
    <div class="container">
        <el-row style="    line-height: 70px;">
            <el-col :span="2">
                <img class="saomiaoIcon" src="@/assets/images/saomiao.png" alt="">
            </el-col>
            <el-col :span="18">
                <span class="saomiaoTxt" v-if="complete=='1'">
                    模型扫描，请配置好<span class="bold">扫描对象</span>和<span class="bold">监控指标</span>后开始扫描
                </span>
                <span class="saomiaoTxt" v-if="complete=='2'">
                    <span class="bold">智能扫描中...</span> <span class="bold">{{percentage}}%</span>
                </span>

                <span class="saomiaoTxt" v-if="complete=='3'">
                    <span class="bold">扫描完成</span>
                </span>

            </el-col>
            <el-col :span="4">
                <el-button type="primary" size="mini" @click="test()">开始扫描</el-button>
                <el-button type="primary" size="mini" @click="go('config',rowData)">配置</el-button>
            </el-col>
        </el-row>

        <!-- <div class="btn">
            
        </div> -->

        <div class="scan">
            <div class="scan-item">
                对象： <span>{{oldData.taskEnterpriseInfoList.length}}</span>个
            </div>

            <div class="scan-item" style="text-align: right;">
                指标：<span>{{oldData.zbsl}}</span>类 共<span>{{oldData.quotasInfoList.length}}</span> 个
            </div>
        </div>
        <div class="scanContent">
            <div class="result" v-for="(value, key,index) in objData" :key="key" :style="{'margin-top':index>=1?'30px':'0'}">
                <div class="result-title">
                    <div class="l">
                        <img src="@/assets/images/u5370.png" alt="">
                        <span>{{ key }} </span>

                    </div>
                    <div class="r">
                        共 {{value.filter(item => item.result === "1").length}} 个疑点
                    </div>
                </div>
                <div class="result-table">
                    <el-table v-loading="loading" ref="bqEltable" :show-header="false" :data="value" style="width: 100%" fit :border="false">
                        <el-table-column label="指标名称" prop="quotasDesc" align="left">
                            <template slot-scope="scope">
                                <span :class="[scope.row.result === '1' ? 'textRedColor' : '']">{{ scope.row.quotasDesc }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="疑点" prop="result" align="right">
                            <template slot-scope="scope">

                                <span v-if="scope.row.result === '1'" class="textRedColor" @click="downFile(scope.row.taskBatchId)">疑点</span>
                                <span v-else class="textblueColor" @click="downFile(scope.row.taskBatchId)">正常</span>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>

        </div>
    </div>
</template>

<script>

import { insert_task, scanTasktest, download_report } from '@/api/znjk/znjk'
import { isObjEmpty } from '@/utils/utils'
export default {

    name: 'sssmList',
    props: {
        rowData: {
            type: Object,
            default: function () {
                return {}
            }
        }
    },
    data() {
        return {
            loading: false,
            run: false,
            complete: 1,
            swtableColumns: [
                {
                    label: '指标名称',
                    prop: 'bmc',
                    align: 'center',
                    minWidth: 120,

                },
                {
                    label: '疑点',
                    prop: 'yd',
                    align: 'center',
                    minWidth: 120,
                }
            ],
            tableDatas: [
                {
                    zbmc: '缴纳契税未缴纳土地税风险',
                    yd: '疑点',
                },
                {
                    zbmc: '企业所得税申报房屋建筑物，但未按规定缴纳房产税',
                    yd: '正常',
                },
                {
                    zbmc: '契税转移面积不等于土地税源信息表中的面积',
                    yd: '正常',
                },
                {
                    zbmc: '企业所得税申报土地使用权，但未按规定缴纳城镇土地使用税（核心）',
                    yd: '疑点',
                },
                {
                    zbmc: '契税转移面积不等于土地税源信息表中的面积',
                    yd: '正常',
                }
            ],
            id: '',
            percentage: 0,
            oldData: { taskEnterpriseInfoList: [], quotasInfoList: [], zbsl: 0 },
            objData: {}
        }
    },

    mounted() {
        if (!isObjEmpty(this.rowData)) {
            this.oldData = this.rowData
        }
    },
    methods: {

        //调试
        test() {

            if (isObjEmpty(this.rowData)) {
                this.$message('请先进行配置！')
            } else {
                this.complete = 2
                let params = {
                    quotasInfoList: this.rowData.quotasInfoList,
                    taskEnterpriseInfoList: this.rowData.taskEnterpriseInfoList,
                    taskInfo: {
                        task_name: '实时扫描',
                        task_desc: '',
                        yxbz: 'N',
                        cron_expression: '* * * * 2099 ?'
                    }
                }
                let intervalId = setInterval(() => {
                    if (this.percentage == 100) {
                        clearInterval(intervalId);
                        return;
                    }
                    this.percentage++;
                }, 150);
                this.run = false
                insert_task(params).then(res => {
                    console.log(res)

                    this.percentage = 95
                    clearInterval(intervalId);
                    if (res.code == 200) {
                        scanTasktest({ task_id: res.message }).then(re => {

                            if (re.code == 200) {
                                this.complete = 3
                                let keyArr = []
                                for (const key in re.data) {
                                    console.log(key)
                                    keyArr.push(key)
                                }

                                console.log(re.data[keyArr[0]][0])
                                this.downFile(re.data[keyArr[0]][0].taskBatchId)
                            }

                            clearInterval(intervalId);
                            this.percentage = 0
                            this.objData = re.data
                            // this.rowData = {}
                        })
                    }
                })
            }

        },

        downFile(taskBatchId) {
            download_report({ batchId: taskBatchId }).then(res => {
                console.log(res)

                const blob = new Blob([res], {
                    type: "application/msword"
                });
                const elink = document.createElement("a");
                elink.download = localStorage.getItem('jmFileName')||'智能监控报告_'+taskBatchId+'.docx';
                elink.style.display = "none";
                elink.href = URL.createObjectURL(blob);
                document.body.appendChild(elink);
                elink.click();
                URL.revokeObjectURL(elink.href); // 释放URL 对象
                document.body.removeChild(elink);
            })
        },
        go(name, params) {
            this.$emit('changePage', name, params);
        },
    }
}
</script>



<style lang="scss" scoped>
.container {
    height: 100%;
    width: 100%;
    background-color: #fff;
    padding: 8px;
    .saomiaoIcon {
        display: block;
        width: 70px;
        height: 70px;
    }

    .saomiaoTxt {
        display: block;
        line-height: 70px;
        font-size: 22px;

        .bold {
            font-weight: 900;
            font-size: 22px;
        }
    }

    .scan {
        margin: 10px 0;
        height: 45px;
        line-height: 45px;
        padding: 0 20px;
        background: inherit;
        background-color: rgba(242, 242, 242, 1);
        box-sizing: border-box;
        border-width: 1px;
        border-style: solid;
        border-color: rgba(215, 215, 215, 1);
        display: flex;
        justify-content: space-between;
        align-items: center;

        .scan .scan-item {
            font-size: 14px;
        }
    }
    .result {
        .result-title {
            height: 32px;
            line-height: 32px;
            color: #000;
            background-color: rgba(214, 220, 224, 1);
            line-height: 32px;
            padding-left: 10px;
            display: flex;
            justify-content: space-between;

            .l,
            .r {
                line-height: 32px;

                img {
                    margin-top: 3px;
                    width: 26px;
                    height: 26px;
                    vertical-align: top;
                }
            }
            .r {
                font-size: 12px;
                padding-right: 20px;
            }
        }

        .result-table {
            padding: 10px 20px;
            border: 1px solid #dcdfe6;
        }
    }

    .btn {
        padding: 8px 8px 8px 0;
    }

    ::v-deep .undertxt {
        color: rgb(64, 158, 255);
        cursor: pointer;

        &:hover {
            text-decoration: underline;
        }
    }

    ::v-deep .textRedColor {
        color: rgb(217, 0, 27);
        cursor: pointer;
    }

    ::v-deep .el-table--border th.el-table__cell,
    ::v-deep .el-table td.el-table__cell {
        border-bottom: none !important;
    }

    ::v-deep .el-table--border .el-table__cell {
        border-right: none !important;
    }

    ::v-deep .el-table--group,
    .el-table--border {
        border: none !important;
    }

    .el-table::before {
        height: 0;
    }
}

::v-deep .textRedColor {
    color: rgb(217, 0, 27);
    font-weight: 700;
    cursor: pointer;
}
::v-deep .textblueColor {
    color: rgb(112, 182, 3);
    font-weight: 700;
    cursor: pointer;
}
</style>

